﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="KPIAssignForm.aspx.cs" Inherits="FBKPI.Forms.KPIAssignForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#divBrowseKPI").hide();
            $("#divBrowseKPI").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
            $("#divBrowseVerifier").hide();
            $("#divBrowseVerifier").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
            $("#divBrowseRGM").hide();
            $("#divBrowseRGM").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
            $("#divBrowseLocation").hide();
            $("#divBrowseLocation").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
            $("#divBrowseSubBranch").hide();
            $("#divBrowseSubBranch").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });

            if ($("#txt_kpi").val() == '') {
                $("#btn_BrowseRGM").attr("disabled", true);
                $("#btn_BrowseLocation").attr("disabled", true);
                $("#btn_BrowseSubBranch").attr("disabled", true);
                $("#btn_BrowseVerifier").attr("disabled", true);
            }

            if ($("#txt_rgm").val() == '') {
                $("#btn_BrowseLocation").attr("disabled", true);
                $("#btn_BrowseSubBranch").attr("disabled", true);
            }

            if ($("#txt_location").val() == '') {
                $("#btn_BrowseSubBranch").attr("disabled", true);
            }


            $("#btn_save").click(function () {
                var param = "?";
                var isActive = 'false';
                var weightenable = 'false';
                var uomenable = 'false';

                $('#form1 td input:checked').each(function () {
                    var $cb = $(this);
                    if ($cb.attr('id') == 'chk_active') {
                        isActive = 'true';
                    }
                    if ($cb.attr('id') == 'chk_weightenableflag') {
                        weightenable = 'true';
                    }
                    if ($cb.attr('id') == 'chk_uomenableflag') {
                        uomenable = 'true';
                    }
                });

                param = param + "action=save";
                param = param + "&ID=" + $("#txt_id").val();
                param = param + "&RGM=" + $("#txt_rgmid").val();
                param = param + "&Location=" + $("#txt_locationid").val();
                param = param + "&SubBranch=" + $("#txt_subbranchid").val();
                param = param + "&isActive=" + isActive;
                param = param + "&weightEnable=" + weightenable;
                param = param + "&uomEnable=" + uomenable;
                param = param + "&UOM=" + $("#txt_uomid").val();
                param = param + "&UOMMax=" + $("#txt_uommaxid").val();
                param = param + "&UOMMin=" + $("#txt_uomminid").val();
                param = param + "&KPI=" + $("#txt_kpiid").val();
                param = param + "&Verifier=" + $("#txt_verifierid").val();
                param = param + "&Weight=" + $("#txt_weight").val();
                param = param + "&Polarization=" + $("#txt_polarization").val();
                param = param + "&ManualCalculation=" + $("#txt_manualcalculation").val();
                param = param + "&CurrUser=" + $("#txt_user").val();
                ProcessRequest("KPIAssignHandler.ashx" + param.replace("undefined", ""), "#divdetail", "#KPIAssignTable");
                return false;
            });


            $("#btn_delete").click(function () {
                if (confirm('Are you sure to delete this record?')) {
                    var param = "?";
                    param = param + "action=delete";
                    param = param + "&ID=" + $("#txt_id").val();
                    param = param + "&CurrUser=" + $("#txt_user").val();
                    ProcessRequest("KPIAssignHandler.ashx" + param, "#divdetail", "#KPIAssignTable");
                    return false;
                }
                return false;
            });

            $("#btn_BrowseKPI").click(function () {
                $("#divBrowseKPI").dialog("option", "title", '<span class="header-text">Select KPI</span>');
                $("#divBrowseKPI").dialog("open");
                $('#kpi').dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": false,
                    "bPaginate": true,
                    "bAutoWidth": true,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/KPISerializer.ashx?User=" + $("#txt_user").val(),
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [
                        { "mData": "No" },
                        { "mData": "Description" },
                        { "mData": "isActive" },
                        { "mData": "GroupKPI" },
                        { "mData": "CategoryKPI" },
                        { "mData": "TypeKPI" },
                        { "mData": "SubTypeKPI" },
                        { "mData": "Periode" },
                        { "mData": "ID" }
                    ],
                    "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickKPI('" + oObj.aData["ID"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [8]
                        },
                        { "sClass": "center", "aTargets": [0, 2, 8] },
                        { "fnRender":
                            function (oObj) {
                                if (oObj.aData["isActive"] == 'True') {
                                    return "<img src='../images/check.png' />"
                                }
                                else {
                                    return "<img src='../images/cross.png' />"
                                }
                            },
                            "aTargets": [2]
                        }
                    ]
                });

                //mark selected row
                $('body').on("click", '#kpi tbody tr', function () {
                    $('#kpi tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                $(".dataTables_filter input").focus();
                return false;
            });

            PickKPI = function (KPIID) {
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": "../Serializer/KPIByIDSerializer.ashx?KPI=" + KPIID,
                    "success": function (data) {
                        $("#txt_kpiid").val(KPIID);
                        $("#txt_kpi").val(data.result.Description);
                        $("#txt_weight").val(data.result.Weight);
                        $("#txt_polarization").val(data.result.Polarization);
                        if (data.result.UoM == null) {
                            $("#txt_uom").val('');
                            $("#txt_uomid").val('');
                        }
                        else {
                            $("#txt_uom").val(data.result.UoM.Description);
                            $("#txt_uomid").val(data.result.UoM.ID);
                        }


                        if (data.result.UoMDetailMax == null) {
                            $("#txt_uommax").val('');
                            $("#txt_uommaxid").val('');
                        }
                        else {
                            $("#txt_uommax").val(data.result.UoMDetailMax.Description);
                            $("#txt_uommaxid").val(data.result.UoMDetailMax.ID);
                        }


                        if (data.result.UoMDetailMin == null) {
                            $("#txt_uommin").val('');
                            $("#txt_uomminid").val('');
                        }
                        else {
                            $("#txt_uommin").val(data.result.UoMDetailMin.Description);
                            $("#txt_uomminid").val(data.result.UoMDetailMin.ID);
                        }
                        

                        $("#txt_manualcalculation").val(data.result.ManualCalculation);

                        $("#form1 td input[type='checkbox']").each(function () {
                            var $cb = $(this);
                            if ($cb.attr('id') == 'chk_weightenableflag') {
                                if (data.result.WeightEnableFlag.toString() == 'true')
                                    $cb.prop('checked', true);
                            }
                            if ($cb.attr('id') == 'chk_uomenableflag') {
                                if (data.result.UoMEnableFlag.toString() == 'true')
                                    $cb.prop('checked', true);
                            }
                        });

                        $("#btn_BrowseRGM").attr("disabled", false);
                        $("#btn_BrowseVerifier").attr("disabled", false);

                        $("#txt_rgm").val('');
                        $("#txt_rgmid").val('');
                        $("#txt_location").val('');
                        $("#txt_locationid").val('');
                        $("#txt_subbranch").val('');
                        $("#txt_subbranchid").val('');
                        $("#txt_verifier").val('');
                        $("#txt_verifierid").val('');
                        $("#btn_BrowseLocation").attr("disabled", true);
                        $("#btn_BrowseSubBranch").attr("disabled", true);
                    }
                });

                $("#divBrowseKPI").dialog("close");
            }


            $("#btn_BrowseVerifier").click(function () {
                $("#divBrowseVerifier").dialog("option", "title", '<span class="header-text">Select Verifier</span>');
                $("#divBrowseVerifier").dialog("open");
                $('#verifier').dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": false,
                    "bPaginate": true,
                    "bAutoWidth": true,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/EmployeeSerializer.ashx",
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [
                        { "mData": "No" },
                        { "mData": "FirstName" },
                        { "mData": "LastName" },
                        { "mData": "Department" },
                        { "mData": "Section" },
                        { "mData": "SubSection" },
                        { "mData": "JobPosition" },
                        { "mData": "ID" }
                    ],
                    "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickVerifier('" + oObj.aData["ID"] + "','" + oObj.aData["FirstName"] + " " + oObj.aData["LastName"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [7]
                        },
                        { "sClass": "center", "aTargets": [0, 7] }
                    ]
                });

                //mark selected row
                $('body').on("click", '#verifier tbody tr', function () {
                    $('#verifier tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                $(".dataTables_filter input").focus();
                return false;
            });

            PickVerifier = function (VerifierID, VerifierName) {
                $("#txt_verifier").val(VerifierName);
                $("#txt_verifierid").val(VerifierID);
                $("#divBrowseVerifier").dialog("close");
            }


            $("#btn_BrowseRGM").click(function () {
                $("#divBrowseRGM").dialog("option", "title", '<span class="header-text">Select RGM</span>');
                $("#divBrowseRGM").dialog("open");
                $('#rgm').dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": false,
                    "bPaginate": true,
                    "bAutoWidth": true,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/RGMSerializer.ashx",
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [
                        { "mData": "No" },
                        { "mData": "Description" },
                        { "mData": "RGMType" },
                        { "mData": "isActive" },
                        { "mData": "ID" }
                    ],
                    "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickRGM('" + oObj.aData["ID"] + "','" + oObj.aData["Description"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [4]
                        },
                        { "sClass": "center", "aTargets": [0, 3, 4] },
                        { "fnRender":
                            function (oObj) {
                                if (oObj.aData["isActive"] == 'True') {
                                    return "<img src='../images/check.png' />"
                                }
                                else {
                                    return "<img src='../images/cross.png' />"
                                }
                            },
                            "aTargets": [3]
                        }
                    ]
                });

                //mark selected row
                $('body').on("click", '#rgm tbody tr', function () {
                    $('#rgm tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                $(".dataTables_filter input").focus();
                return false;
            });

            PickRGM = function (RGMID, RGDesc) {
                $("#txt_rgm").val(RGDesc);
                $("#txt_rgmid").val(RGMID);
                $("#btn_BrowseLocation").attr("disabled", false);
                $("#divBrowseRGM").dialog("close");

                $("#txt_location").val('');
                $("#txt_locationid").val('');
                $("#txt_subbranch").val('');
                $("#txt_subbranchid").val('');
            }


            $("#btn_BrowseLocation").click(function () {
                $("#divBrowseLocation").dialog("option", "title", '<span class="header-text">Select Location</span>');
                $("#divBrowseLocation").dialog("open");
                $('#location').dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": false,
                    "bPaginate": true,
                    "bAutoWidth": true,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/LocationByRGMIDSerializer.ashx?RGM=" + $("#txt_rgmid").val(),
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [
                        { "mData": "No" },
                        { "mData": "Description" },
                        { "mData": "RGM" },
                        { "mData": "isActive" },
                        { "mData": "ID" }
                    ],
                    "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickLocation('" + oObj.aData["ID"] + "','" + oObj.aData["Description"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [4]
                        },
                        { "sClass": "center", "aTargets": [0, 3, 4] },
                        { "fnRender":
                            function (oObj) {
                                if (oObj.aData["isActive"] == 'True') {
                                    return "<img src='../images/check.png' />"
                                }
                                else {
                                    return "<img src='../images/cross.png' />"
                                }
                            },
                            "aTargets": [3]
                        }
                    ]
                });

                //mark selected row
                $('body').on("click", '#location tbody tr', function () {
                    $('#location tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                $(".dataTables_filter input").focus();
                return false;
            });

            PickLocation = function (locationID, locationDesc) {
                $("#txt_location").val(locationDesc);
                $("#txt_locationid").val(locationID);
                $("#btn_BrowseSubBranch").attr("disabled", false);
                $("#divBrowseLocation").dialog("close");

                $("#txt_subbranch").val('');
                $("#txt_subbranchid").val('');
            }


            $("#btn_BrowseSubBranch").click(function () {
                $("#divBrowseSubBranch").dialog("option", "title", '<span class="header-text">Select Sub Branch</span>');
                $("#divBrowseSubBranch").dialog("open");
                $('#subbranch').dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": false,
                    "bPaginate": true,
                    "bAutoWidth": true,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/SubBranchByLocationIDSerializer.ashx?Location=" + $("#txt_locationid").val(),
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [
                        { "mData": "No" },
                        { "mData": "Description" },
                        { "mData": "Location" },
                        { "mData": "isActive" },
                        { "mData": "ID" }
                    ],
                    "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickSubBranch('" + oObj.aData["ID"] + "','" + oObj.aData["Description"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [4]
                        },
                        { "sClass": "center", "aTargets": [0, 3, 4] }
                    ]
                });

                //mark selected row
                $('body').on("click", '#subbranch tbody tr', function () {
                    $('#subbranch tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                $(".dataTables_filter input").focus();
                return false;
            });

            PickSubBranch = function (subbranchID, subbranchDesc) {
                $("#txt_subbranch").val(subbranchDesc);
                $("#txt_subbranchid").val(subbranchID);
                $("#divBrowseSubBranch").dialog("close");
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="kpiassignformarea" class="ui-widget-content padding5px ui-corner-all">
            <table class="dialogTable" width="100%">
                <tr>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">ID</td>
                                <td class="Separator">:</td>
                                <td><asp:TextBox ID="txt_id" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td>KPI</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_kpi" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <button id="btn_BrowseKPI" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_kpiid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>RGM</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_rgm" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <button id="btn_BrowseRGM" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_rgmid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>Branch</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_location" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <button id="btn_BrowseLocation" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_locationid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>SubBranch</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_subbranch" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <button id="btn_BrowseSubBranch" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_subbranchid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>Weight</td>
                                <td>:</td>
                                <td><asp:TextBox ID="txt_weight" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td>Verifier</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_verifier" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <button id="btn_BrowseVerifier" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_verifierid" runat="server" />
                                </td>
                            </tr>
                        </table>
                    </td>
                    <td width="50%">
                        <table>
                            <tr>
                                <td>Polarization</td>
                                <td class="Separator">:</td>
                                <td><asp:TextBox ID="txt_polarization" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td width="140px">Unit of Measure</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_uom" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <input type="hidden" id="txt_uomid" runat="server"/>
                                </td>
                            </tr>                
                            <tr>
                                <td>UoM Max</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_uommax" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <input type="hidden" id="txt_uommaxid"  runat="server" />
                                </td>
                            </tr>          
                            <tr>
                                <td>UoM Min</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_uommin" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <input type="hidden" id="txt_uomminid"  runat="server" />
                                </td>
                            </tr>              
                            <tr>
                                <td>Manual Calculation</td>
                                <td>:</td>
                                <td><asp:TextBox ID="txt_manualcalculation" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr
                            <tr>
                                <td>Weight Enable Flag</td>
                                <td>:</td>
                                <td>
                                    <asp:CheckBox ID="chk_weightenableflag" runat="server" Enabled="false"/>
                                </td>
                            </tr>
                            <tr>
                                <td>UoM Enable Flag</td>
                                <td>:</td>
                                <td>
                                    <asp:CheckBox ID="chk_uomenableflag" runat="server" Enabled="false"/>
                                </td>
                            </tr>
                            <tr>
                                <td>is Active</td>
                                <td>:</td>
                                <td><asp:CheckBox ID="chk_active" runat="server"/></td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
        <br />
        <div id="AuditInformation" class="ui-widget-content padding5px ui-corner-all">
            <b style="margin-left:5px">Audit Information</b>
            <table class="dialogTable">
                <tr>
                    <td width="140px">Last Modified Date</td>
                    <td class="Separator">:</td>
                    <td><asp:TextBox ID="txt_lastmodifieddate" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Last Modified By</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_lastmodifiedby" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Create Date</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_createdate" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Create By</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_createby" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
            </table>
        </div>
        <div id="divBrowseKPI" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="kpi">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            Description
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                            Group
                        </th>
                        <th>
                            Category
                        </th>
                        <th>
                            Type
                        </th>
                        <th>
                            Sub Type
                        </th>
                        <th>
                            Periode
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseVerifier" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="verifier">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            First Name
                        </th>
                        <th>
                            Last Name
                        </th>
                        <th>
                            Department
                        </th>
                        <th>
                            Section
                        </th>
                        <th>
                            Sub Section
                        </th>
                        <th>
                            Job Position
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseRGM" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="rgm">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            Description
                        </th>
                        <th>
                            RGM Type
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseLocation" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="location">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            Description
                        </th>
                        <th>
                            RGM
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseSubBranch" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="subbranch">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            Description
                        </th>
                        <th>
                            Branch
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <br />
        <button id="btn_save" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary" runat="server" name="btnSave">
            <span class="ui-button-icon-primary ui-icon ui-icon-check"></span>
            <label class="ui-button-text">
                Save</label>
        </button>

        <button id="btn_delete" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary" runat="server">
            <span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
            <label class="ui-button-text">
                Delete</label>
        </button>
    </form>
</body>
</html>
